<template>
    <div class="home viewer">
        <vc-viewer ref="viewerRef" :info-box="false" :show-credit="false" :selectionIndicator="false"
            :scene3DOnly="true" @ready="onViewerReady">
            <vc-layer-imagery>
                <!-- 天地图 -->
                <vc-imagery-provider-tianditu token="436ce7e50d27eede2f2929307e6b33c0"></vc-imagery-provider-tianditu>
            </vc-layer-imagery>
            <!-- 广告牌 -->
            <bill-board />
            <!-- 水特效 -->
            <dynamic-water />
        </vc-viewer>
    </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { VcReadyObject } from 'vue-cesium/es/utils/types'
import DynamicWater from '@/components/DynamicWater/index.vue';
import BillBoard from '@/components/BillBoard/index.vue';

let viewer = ref(null)

const onViewerReady = (readyObj: VcReadyObject) => {
    viewer.value = readyObj.viewer
}

</script>

<style scoped>
.viewer {
    height: 100vh;
    width: 100%;
}
</style>
